<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="author" content="9.20表白节"/>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>9.20表白节</title>
    <link rel="stylesheet" href="css/style.css"/>
</head>
<body>
    <div class="container">
        <div class="after">
            <img src="image/16_wx_01.png" alt=""/>
        </div>
        <div class="love">
            <div class="love-bg after">
                <img src="image/16_wx_13_01.png" alt=""/>
                <img src="image/16_wx_13_01.png" alt=""/>
                <img src="image/16_wx_13_01.png" alt=""/>
                <img src="image/16_wx_13_01.png" alt=""/>
                <img src="image/16_wx_13_01.png" alt=""/>
                <img src="image/16_wx_13_01.png" alt=""/>
                <img src="image/16_wx_13_01.png" alt=""/>
                <img src="image/16_wx_13_01.png" alt=""/>
                <img src="image/16_wx_13_01.png" alt=""/>
            </div>
            <div class="love-content">
                <div class="love-content-person after">
                    <div class="love-person-img lf">
                        <img src="image/16_wx_17.png" alt=""/>
                    </div>
                    <div class="love-person-info">
                        <h4>他的表白</h4>
                        <p>
                            亲爱的XXX，你不开心的时候，我陪你，你哭泣的时候，我陪你，你心情很不爽的时候，我陪你，你不想回家的时候，我陪你，无论怎样，我都陪你，只因为你是我最爱的...
                        </p>
                    </div>
                </div>
                <div class="love-person-rank">
                    <h4>已获得 <span> 999 </span> 个祝福 | 现排在第 <span> 9 </span> 名 <input type="button" class="love-person-rank-btn"/></h4>
                </div>
            </div>

        </div>
        <div class="after">
            <img src="image/16_wx_06.png" alt=""/>
        </div>
        <div class="love-input">
            <div class="love-input-bg after">
                <img src="image/16_wx_08.png" alt=""/>
            </div>
            <div class="love-input-content">
                <textarea placeholder="输入对ta的祝福（选填）" name="love-input-area" id="love-input-area" ></textarea>
                <div class="love-input-wish after">
                    <img src="image/16_wx_09.png" alt=""/>
                    <img src="image/16_wx_10.png" alt=""/>
                    <button class="love-input-wish-btn" id="showPop"></button>
                </div>
            </div>
        </div>
        <div class="join ">
            <div class="join-container after">
                <img src="image/16_wx_11.png" alt=""/>
                <div class="join-container-btn">
                    <button class="btn"></button>
                </div>
            </div>

        </div>
        <div class="love-list">
            <div class="love-list-bg after">
                <img src="image/16_wx_12.png" alt=""/>
            </div>
            <div  id="loveListBg">

            </div>
            <div class="love-list-content">
                <ul class="love-list-lists" id="loveListLists">
                </ul>
            </div>
            <div class="love-list-bottom after">
                <img src="image/16_wx_14.png" alt=""/>
                <div class="love-list-moreBtn">
                    <div>
                        <button id="moreBtn"></button>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <div class="popover" id="popOver">
        <div class="popover-content after">
            <div class="pop-close" id="popClose">
                <img src="image/16_wx_16.png" alt=""/>
            </div>
            <div class="pop-erweima">
                <img src="image/m_05.jpg" alt=""/>
            </div>
            <div class="pop-text">
                <p>长摁识别二维码</p>
                <p>
                    马上送出祝福
                </p>
            </div>
        </div>
    </div>

<script src="js/index.js"></script>
</body>
</html>